import { vw } from '@/common/dimensions'
import LazyImage from '@/components/LazyImage'
import { SceneItemType } from '@/store/home'
import React from 'react'
import { Image, StyleSheet, View } from 'react-native'
import SceneFooter from './SceneFooter'
import TopLeftIcon from '../TopLeftIcon'


export default function TempScene(props:{sceneItem:SceneItemType}) {
    let { sceneItem } = props
    let { iconPath } = sceneItem
    let cover_image = (sceneItem.json_content.cover_image) as string
    return (
        <View style={styles.root}>
            <TopLeftIcon iconPath={iconPath} />
            {/* <Image style={styles.sceneImage} source={{ uri:cover_image }}/>  对比效果查看 */}
            <LazyImage
                style={styles.sceneImage}
                uri={cover_image}
                defaultSource={require('@/assets/common/perch.png')}
            />
            <SceneFooter
                title={sceneItem.json_content.cn.title}
                points={sceneItem.points_json.points}
            />
        </View>        
    )
}
const styles = StyleSheet.create({
    root:{
        width: 46 * vw,
        height: 59 * vw,
        borderRadius: 16,
        marginBottom:16
    },
    sceneImage:{
        width: '100%',
        height: '100%',
        borderRadius: 16
    }
})
